import { Select } from 'antd';
import React, { Component, useState, useEffect } from 'react';

let { Option } = Select;

const Cascader = ({ value, onChange, option, resetkey, form,mode,placeholder,rowkey,disabledlist }) => {

    const [innerOptions, setOptions] = useState([]);
    useEffect(() => {
        if (Array.isArray(option)) {
            setOptions(() => {
                return option.map(it => ({
                    label: it.name,
                    value:rowkey?it[rowkey]:it.name,
                    disabled: disabledlist && disabledlist.some(item=>item==it[rowkey]||item==it.name)
                }))
            })
        } else {
            option.database(option.params).then(res => {
                setOptions(() => {
                    return res.data.dataList.map(it => ({
                        label: it.name,
                        value: rowkey?it[rowkey]:it.name,
                        disabled:disabledlist && disabledlist.some(item=>item==it[rowkey]||item==it.name)
                    }))
                })
            })
        }
    }, [JSON.stringify(option)]);

    return <Select
        showSearch
        mode={mode||""}
        placeholder={placeholder||"请选择"}
        allowClear style={{ width: "100%" }}
        options={innerOptions} value={value} onChange={(val) => {
            onChange(val)
            if(resetkey){
                resetkey.map(it=>{
                    form.setFieldsValue({[it]:null})
                })
            }
        }} />;
};


export default Cascader